function getInputBoxes() {
    const nameInput = document.getElementById("name_input");
    const genderInput = document.getElementById("gender_input");
    const ageInput = document.getElementById("age_input");
    const passwordInput = document.getElementById("password_input");
    const password_verify = document.getElementById("password_verify");
    const submitButton = document.getElementById("submit_btn");


    function parseJson(response) {
        response = response.json();
        let info = response["info"];

    }

    function handleSubmit() {
        const content = {
            "name": nameInput.value,
            "gender": genderInput.value,
            "age": ageInput.value,
            "password": passwordInput.value,
            "password_reenter": password_verify.value,
        };

        fetch("account_creator", {
            method: 'POST', headers: {
                'Content-Type': 'application/json'
            }, body: JSON.stringify(content)
        })
            .then(response => {
                response = response.json();
                return response;
            })
            .then(data => {
                console.log(data);
                const info = data["info"];
                if (info == null || info.length === 0) {
                    alert(data["error_description"]);
                    return null;
                }
                return JSON.parse(data["info"])
            })
            .then(info => {
                if (info == null) return;
                const ResultTable = document.getElementById("table_body");
                alert(info);
                console.log(info);
                for (let i = 0; i < info.length; i++) {
                    const row = document.createElement("tr");
                    row.innerHTML = `<td>${info[i].name}</td>` + `<td>${info[i].gender}</td>` + `<td>${info[i].age}</td>` + `<td>${info[i].password}</td>`;
                    ResultTable.appendChild(row);
                    console.log(info[i]);
                }
            })
            .catch(reason => {
                alert(reason);
            })
    }

    submitButton.onclick = handleSubmit;
}

document.addEventListener("DOMContentLoaded", getInputBoxes);
